import React from 'react'
import LikesButton from './LikesButton'

class NameCard extends React.Component {
    render() {
        const { name, number, isHuman, tags, logo } = this.props
        return (

            <div className="card">
                <img src={logo} className="App-logo" alt="logo" />
                <div className="card-body">
                    <h5 className="card-title">{name} <LikesButton /></h5>
                    <ul className="list-group list-group-flush">
                        <li className="list-group-item">电话：{number}</li>
                        <li className="list-group-item">{isHuman ? '前端' : '后端'}</li>
                    </ul>
                    <p className="card-text">好友印象: {tags.map((tag, index) => (
                        <span className="btn btn-primary" style={{ marginRight: '10px' }} key={index}>{tag}</span>
                    ))}</p>
                </div>
            </div>

        )

    }

}

export default NameCard